
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="Generator" content="EditPlus®">
    <meta name="Author" content="">
    <meta name="Keywords" content="">
    <meta name="Description" content="">
    <title>{$_W['account']['name']}</title>
    <meta name="keywords" content="" />
    <meta name="description" content="" />
    <link rel="shortcut icon" href="{if !empty($_W['setting']['copyright']['icon'])}{$_W['attachurl']}{$_W['setting']['copyright']['icon']}{else}./resource/images/favicon.ico{/if}" />

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="../addons/kundian_farm/resource/home/css/reset.css" />
    <link rel="stylesheet" type="text/css" href="../addons/kundian_farm/resource/home/css/base.css" />
    <link rel="stylesheet" type="text/css" href="../addons/kundian_farm/resource/home/css/icon/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="../addons/kundian_farm/resource/home/css/home-style.css" />
    <script src="../addons/kundian_farm/resource/home/js/jquery.min.js"></script>
    <script src="../addons/kundian_farm/resource/home/js/vue.js"></script>
    <script type="text/javascript" src="../addons/kundian_farm/resource/home/js/vue-dragging.es5.js"></script>
    <title>自定义首页</title>
</head>

<body>
    <script>
        Vue.use(VueDragging)
        if (localStorage.getItem('list')) {
            let data = JSON.parse(localStorage.getItem('list'))
            VM.allLists = data
            VM.MaxId = data.length
        } else {
//            $.ajax({
//                url: 'https://www.easy-mock.com/mock/5b59601d2d340a0cf16733f3/components/index/index',
//                type: 'Get',
//                success: res => {
//                    VM.allLists = res.data.lists
//                    VM.MaxId = res.data.lists.length
//                }
//            })
        }
    </script>
    <div id="app">
        <div class="mian_content clear">
            <div class="mianWrapper">
                <div class="wxHd">
                    <div>微信小程序</div>
                </div>
                <div class="activeWrapper">
                    <ul>
                        <li v-for="(item, index) in allLists" :key="index" v-dragging="{ item: item, list: allLists, group: 'index' }" class="activeWrapper_li">
                            <div class="iconfont deleteDom" @click="deleteDom(item.id)">&#xe64b;</div>
                            <banner v-if="item.type === 'banner'" :id="item.id" :focus="item.focus" :focus-color="item.focusColor" :img-url="item.imgUrl"
                                :swiper-height="item.swiperHeight"></banner>
                            <blank v-if="item.type === 'blank'" :id="item.id" :bg-color="item.bgColor" :height="item.height"></blank>
                            <advert v-if="item.type === 'advert'" :id="item.id" :height="item.height" :ad-lists="item.adLists"></advert>
                            <navigation v-if="item.type === 'navigation'" :id="item.id" :column="item.column" :font-color="item.fontColor" :font-size="item.fontSize"
                                :radius="item.radius" :list="item.list"></navigation>
                            <headline v-if="item.type === 'headline'" :id="item.id" :text="item.text" :styles="item.style" :font-color="item.fontColor"
                                :font-size="item.fontSize" :bg-color="item.bgColor"></headline>
                            <search v-if="item.type === 'search'" :id="item.id" :search-color="item.searchColor" :bg-color="item.bgColor" :font-color="item.fontColor"
                                :hot-search="item.hotSearch"></search>
                            <lines v-if="item.type === 'line'" :id="item.id" :styles="item.styles" :line-color="item.lineColor" :bg-color="item.bgColor"
                                :line-height="item.lineHeight" :height="item.height"></lines>
                            <glossary v-if="item.type === 'glossary'" :id="item.id" :styles="item.styles" :title-size="item.titleSize" :title-color="item.titleColor"
                                :bg-color="item.bgColor" :lists="item.lists"></glossary>
                            <buttons v-if="item.type === 'button'" :id="item.id" :parma="item.parma"></buttons>
                            <picture-list v-if="item.type === 'pictureList'" :id="item.id" :styles="item.styles" :column="item.column" :radius="item.radius"
                                :lists="item.lists"></picture-list>
                            <fixed v-if="item.type === 'fixed'" :id="item.id" :bottom="item.bottom" :left="item.left" :opacity="item.opacity" :bg-color="item.bgColor"
                                :img="item.img"></fixed>
                            <videos v-if="item.type === 'video'" :id="item.id" :poster="item.poster" :src="item.src" :auto-play="item.autoPlay"></videos>
                            <audios v-if="item.type === 'audio'" :id="item.id" :poster="item.poster" :src="item.src" :name="item.name" :author="item.author"></audios>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="edditWrapper" v-if="currentType">
                <!-- 轮播图 -->
                <div v-if="currentType === 'banner'" class="banner_container">
                    <div class="common_title">轮播图</div>
                    <div class="common_content">
                        <span class="labelStyle">焦点颜色:</span>
                        <input type="color" class="input_Color" v-model="setBannerFocusColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">显示焦点:</span>
                        <label class="radiobox">
                            <input name="currentRadio" type="radio" :checked='setIsFocus(true)' @click="focus(true)" />显示</label>
                        <label class="radiobox">
                            <input name="currentRadio" type="radio" :checked='setIsFocus(false)' @click="focus(false)" />隐藏</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">轮播高度:</span>
                        <input type="range" min="1" max="200" step="1" class="range_style" v-model="bannerHeight" />
                        <span v-text="bannerHeight + '%'"></span>
                    </div>
                    <div v-for="(item, index) in allLists" :key="index" v-if="item.type === 'banner'&&item.id ===currentId">
                        <ul>
                            <li v-for="(list,index) in item.imgUrl" :key="index" class="banner_main_wrapper clear">
                                <div class="iconfont deleteBanner" @click.stop="deleteBanner(index)">&#xe64b;</div>
                                <div class="banner_img_wrapper" @click="selectBannerImg(index)">
                                    <img :src="list.img" class="bigImg" />
                                </div>
                                <div class="banner_link_wrapper">
                                    <span>链接 : </span>
                                    <input disabled type="text" placeholder="点击选择跳转链接" @input="addLink(index)" />
                                </div>
                            </li>
                            <div class="addNewBanner" @click="addBanner">
                                <span class="iconfont addIcon">&#xe606;</span>新增一个轮播图
                            </div>
                        </ul>
                    </div>
                </div>
                <!-- 辅助空白 -->
                <div v-if="currentType === 'blank'" class="banner_container">
                    <div class="common_title">辅助空白</div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="blank_bgColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">空白高度:</span>
                        <input type="range" min="1" max="200" step="1" class="range_style" v-model="setBlankHeight" />
                        <span v-text="setBlankHeight + 'px'"></span>
                    </div>
                </div>
                <!-- 广告 -->
                <div v-if="currentType === 'advert'" class="banner_container">
                    <div class="common_title">广告位</div>
                    <div class="common_content">
                        <span class="labelStyle">高度:</span>
                        <input type="range" min="1" max="300" step="1" class="range_style" v-model="setAdvertHeight" />
                    </div>
                    <div v-for="(item, index) in allLists" :key="index" v-if="item.type === 'advert'&& item.id ===currentId">
                        <ul>
                            <li v-for="(list,index) in item.adLists" :key="index" class="banner_main_wrapper clear">
                                <div class="iconfont deleteBanner" @click.stop="deleteAdvert(index)">&#xe64b;</div>
                                <div class="banner_img_wrapper" @click="selectAdvImg(index)">
                                    <img :src="list.img" class="navImg" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>宽度比例:</span>
                                    <input type="text" placeholder="请输入宽度" v-model="list.width" />%
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>链接:</span>
                                    <input disabled type="text" placeholder="点击选择跳转链接" @input="addLink(index)" v-model="list.direction" />
                                </div>
                            </li>
                            <div class="addNewBanner" @click="addAdvert">
                                <span class="iconfont addIcon">&#xe606;</span>新增一张图片
                            </div>
                        </ul>
                    </div>
                </div>
                <!-- 宮格导航 -->
                <div v-if="currentType === 'navigation'" class="banner_container">
                    <div class="common_title">宮格导航</div>
                    <div class="common_contents clear mt10">
                        <span class="labelStyle fl">分列排版:</span>
                        <div class="column_wrapper">
                            <img src="../addons/kundian_farm/resource/home/images/column2.png" :class="setNavColumnStyle(2)" @click="setNavColumn(2)" />
                            <img src="../addons/kundian_farm/resource/home/images/column3.png" :class="setNavColumnStyle(3)" @click="setNavColumn(3)" />
                            <img src="../addons/kundian_farm/resource/home/images/column4.png" :class="setNavColumnStyle(4)" @click="setNavColumn(4)" />
                            <img src="../addons/kundian_farm/resource/home/images/column5.png" :class="setNavColumnStyle(5)" @click="setNavColumn(5)" />
                        </div>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">圆角弧度:</span>
                        <input type="range" min="1" max="50" step="1" class="range_style" v-model="setNavRdadius" />
                        <span v-text="setNavRdadius +'%'"></span>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">字体颜色:</span>
                        <input type="color" class="input_Color" v-model="setNavFontColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">字体大小:</span>
                        <label class="radiobox">
                            <input name="navFontSize" type="radio" :checked='setNavFontStyle(14)' @click="setNavFont(14)" />小号</label>
                        <label class="radiobox">
                            <input name="navFontSize" type="radio" :checked='setNavFontStyle(16)' @click="setNavFont(16)" />中号</label>
                        <label class="radiobox">
                            <input name="navFontSize" type="radio" :checked='setNavFontStyle(18)' @click="setNavFont(18)" />大号</label>
                    </div>
                    <div v-for="(item, index) in allLists" :key="index" v-if="item.type === 'navigation'&& item.id ===currentId">
                        <ul>
                            <li v-for="(list,index) in item.list" :key="index" class="banner_main_wrapper clear">
                                <div class="iconfont deleteBanner" @click.stop="deleteNav(index)">&#xe64b;</div>
                                <div class="banner_img_wrapper" @click="selectNavImg(index)">
                                    <img :src="list.url" class="navImg" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>名称:</span>
                                    <input type="text" placeholder="请填写导航名称" v-model="list.title" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>链接:</span>
                                    <input disabled type="text" placeholder="点击选择跳转链接" @input="addLink(index)" v-model="list.direction" />
                                </div>
                            </li>
                            <div class="addNewBanner" @click="addNav">
                                <span class="iconfont addIcon">&#xe606;</span>新增一个导航图
                            </div>
                        </ul>
                    </div>
                </div>
                <!-- 标题 -->
                <div v-if="currentType === 'headline'" class="banner_container">
                    <div class="common_title">标题</div>
                    <div class="common_content">
                        <span class="labelStyle">标题名:</span>
                        <input type="text" class="headLine_input" v-model="setHeadLineText" />
                    </div>
                    <div class="common_content clear">
                        <span class="labelStyle fl">样式设置:</span>
                        <div class="headline_mian_wrapper">
                            <label class="radiobox">
                                <input name="titleStyle" type="radio" :checked='getHeadLineStyle(1)' @click="setHeadLine(1)"
                                />样式一</label>
                            <label class="radiobox">
                                <input name="titleStyle" type="radio" :checked='getHeadLineStyle(2)' @click="setHeadLine(2)"
                                />样式二</label>
                            <label class="radiobox">
                                <input name="titleStyle" type="radio" :checked='getHeadLineStyle(3)' @click="setHeadLine(3)"
                                />样式三</label>
                            <label class="radiobox">
                                <input name="titleStyle" type="radio" :checked='getHeadLineStyle(4)' @click="setHeadLine(4)"
                                />样式四</label>
                            <label class="radiobox">
                                <input name="titleStyle" type="radio" :checked='getHeadLineStyle(5)' @click="setHeadLine(5)"
                                />样式五</label>
                        </div>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">字体颜色:</span>
                        <input type="color" class="input_Color" v-model="setHeadLineColor" />
                    </div>
                    <div class="common_content clear">
                        <span class="labelStyle fl">字体大小:</span>
                        <div class="headline_mian_wrapper">
                            <label class="radiobox">
                                <input name="titleFontSize" type="radio" :checked='getHeadLineFontSize(14)' @click="setHeadLineFontSize(14)"
                                />小号</label>
                            <label class="radiobox">
                                <input name="titleFontSize" type="radio" :checked='getHeadLineFontSize(16)' @click="setHeadLineFontSize(16)"
                                />中号</label>
                            <label class="radiobox">
                                <input name="titleFontSize" type="radio" :checked='getHeadLineFontSize(18)' @click="setHeadLineFontSize(18)"
                                />大号</label>
                        </div>
                    </div>
                </div>
                <!-- 搜索框 -->
                <div v-if="currentType === 'search'" class="banner_container">
                    <div class="common_title">搜索框</div>
                    <div class="common_content">
                        <span class="labelStyle">搜索框颜色:</span>
                        <input type="color" class="input_Color" v-model="setSearchColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="setSearchBgColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">文字颜色:</span>
                        <input type="color" class="input_Color" v-model="setSearchFontColor" />
                    </div>
                    <div class="common_content mt10">
                        <span class="labelStyle">热门搜索:</span>
                        <input type="text" class="search_input_box" v-model="hotSearch" />
                    </div>
                </div>
                <!-- 分割线 -->
                <div v-if="currentType === 'line'" class="banner_container">
                    <div class="common_title">分割线</div>
                    <div class="common_content">
                        <span class="labelStyle">样式选择:</span>
                        <label class="radiobox">
                            <input name="line" type="radio" :checked='getLineStyle(1)' @click="setLineStyle(1)" />实线</label>
                        <label class="radiobox">
                            <input name="line" type="radio" :checked='getLineStyle(2)' @click="setLineStyle(2)" />虚线</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">线条颜色:</span>
                        <input type="color" class="input_Color" v-model="setLineColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="setLineBgColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">线条高度:</span>
                        <input type="range" class="range_style" min="1" max="20" step="1" v-model="setLineHeight" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">上下边距:</span>
                        <input type="range" class="range_style" min="1" max="100" step="1" v-model="setLinpadding" />
                    </div>
                </div>
                <!-- 图文集 -->
                <div v-if="currentType === 'glossary'" class="banner_container">
                    <div class="common_title">图文集</div>
                    <div class="common_content">
                        <span class="labelStyle">样式选择:</span>
                        <label class="radiobox">
                            <input name="glossaryStyle" type="radio" :checked='getListcurrentStyle(1)' @click="setListcurrentStyle(1)"
                            />样式一</label>
                        <label class="radiobox">
                            <input name="glossaryStyle" type="radio" :checked='getListcurrentStyle(2)' @click="setListcurrentStyle(2)"
                            />样式二</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">标题大小:</span>
                        <label class="radiobox">
                            <input name="glossaryFontSize" type="radio" :checked='getListFontStyle(16)' @click="setListFontStyle(16)"
                            />小号</label>
                        <label class="radiobox">
                            <input name="glossaryFontSize" type="radio" :checked='getListFontStyle(18)' @click="setListFontStyle(18)"
                            />中号</label>
                        <label class="radiobox">
                            <input name="glossaryFontSize" type="radio" :checked='getListFontStyle(20)' @click="setListFontStyle(20)"
                            />大号</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">标题颜色:</span>
                        <input type="color" class="input_Color" v-model="getListTitleColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="getListBgColor" />
                    </div>
                    <div v-for="(item, index) in allLists" :key="index" v-if="item.type === 'glossary'&& item.id ===currentId">
                        <ul>
                            <li v-for="(list,index) in item.lists" :key="index" class="banner_main_wrapper clear">
                                <div class="iconfont deleteBanner" @click.stop="deleteList(index)">&#xe64b;</div>
                                <div class="banner_img_wrapper" @click="selectListImg(index)">
                                    <img :src="list.img" class="navImg" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>名称:</span>
                                    <input type="text" placeholder="请填写导航名称" v-model="list.title" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>描述:</span>
                                    <input type="text" placeholder="请填写导航名称" v-model="list.innerText" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>链接:</span>
                                    <input disabled type="text" placeholder="点击选择跳转链接" @input="addLink(index)" v-model="list.direction" />
                                </div>
                            </li>
                            <div class="addNewBanner" @click="addList">
                                <span class="iconfont addIcon">&#xe606;</span>新增一条图文
                            </div>
                        </ul>
                    </div>
                </div>
                <!-- 按钮 -->
                <div v-if="currentType === 'button'" class="banner_container">
                    <div class="common_title">按钮设置</div>
                    <div class="common_content">
                        <span class="labelStyle">名称:</span>
                        <input type="text" class="headLine_input" v-model="setBtnTitle" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">圆角弧度:</span>
                        <input type="range" class="range_style" min="1" max="50" step="1" v-model="setBtnRadius" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">边框显示:</span>
                        <label class="radiobox">
                            <input name="buttonBorder" type="radio" :checked='getBtnborderShow(true)' @click="setBtnborderShow(true)"
                            />显示</label>
                        <label class="radiobox">
                            <input name="buttonBorder" type="radio" :checked='getBtnborderShow(false)' @click="setBtnborderShow(false)"
                            />隐藏</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">图标显示:</span>
                        <label class="radiobox">
                            <input name="buttonIcon" type="radio" :checked='getBtnIconShow(true)' @click="setBtnIconShow(true)"
                            />显示</label>
                        <label class="radiobox">
                            <input name="buttonIcon" type="radio" :checked='getBtnIconShow(false)' @click="setBtnIconShow(false)"
                            />隐藏</label>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">标题颜色:</span>
                        <input type="color" class="input_Color" v-model="setBtnTitleColor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="setBtnBgolor" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">边框颜色:</span>
                        <input type="color" class="input_Color" v-model="setBtnBorderolor" />
                    </div>
                    <div>
                        <div class="banner_main_wrapper clear">
                            <div class="banner_img_wrapper" @click="setCurrentBtnImg">
                                <img :src="CurrentBtnIcon" class="navImg" />
                            </div>
                            <div class="banner_link_wrapper">
                                <span>链接至:</span>
                                <input disabled type="text" placeholder="点击选择链接" @input="addLink(index)" />
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 图文列表 -->
                <div v-if="currentType === 'pictureList'" class="banner_container">
                    <div class="common_title">图片列表</div>
                    <div class="common_content">
                        <span class="labelStyle">样式选择:</span>
                        <label class="radiobox">
                            <input name="listStyle" type="radio" :checked='getPicStyle(1)' @click="setPicStyle(1)" />样式一</label>
                        <label class="radiobox">
                            <input name="listStyle" type="radio" :checked='getPicStyle(2)' @click="setPicStyle(2)" />样式二</label>
                        <label class="radiobox">
                            <input name="listStyle" type="radio" :checked='getPicStyle(3)' @click="setPicStyle(3)" />样式三</label>
                    </div>
                    <div class="common_contents clear">
                        <span class="labelStyle fl">图片排版:</span>
                        <div class="column_wrapper">
                            <img src="../addons/kundian_farm/resource/home/images/column1.png" :class="getPicColumn(1)" @click="setPicColumn(1)" />
                            <img src="../addons/kundian_farm/resource/home/images/column2.png" :class="getPicColumn(2)" @click="setPicColumn(2)" />
                            <img src="../addons/kundian_farm/resource/home/images/column3.png" :class="getPicColumn(3)" @click="setPicColumn(3)" />
                            <img src="../addons/kundian_farm/resource/home/images/column4.png" :class="getPicColumn(4)" @click="setNavColumn(4)" />
                        </div>
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">圆角比例:</span>
                        <input type="range" class="range_style" min="0" max="50" step="1" v-model="setPicRadius" />
                    </div>
                    <div v-for="(item, index) in allLists" :key="index" v-if="item.type === 'pictureList'&& item.id ===currentId">
                        <ul>
                            <li v-for="(list,index) in item.lists" :key="index" class="banner_main_wrapper clear">
                                <div class="iconfont deleteBanner" @click.stop="deletePic(index)">&#xe64b;</div>
                                <div class="banner_img_wrapper" @click="selectListImg(index)">
                                    <img :src="list.img" class="navImg" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>名称:</span>
                                    <input type="text" placeholder="请填写导航名称" v-model="list.title" />
                                </div>
                                <div class="nav_link_wrapper">
                                    <span>链接:</span>
                                    <input disabled type="text" placeholder="点击选择跳转链接" @input="addLink(index)" v-model="list.direction" />
                                </div>
                            </li>
                            <div class="addNewBanner" @click="addPic">
                                <span class="iconfont addIcon">&#xe606;</span>新增一条图文
                            </div>
                        </ul>
                    </div>
                </div>
                <!-- 悬浮图标 -->
                <div v-if="currentType === 'fixed'" class="banner_container">
                    <div class="common_title">悬浮图标</div>
                    <div class="common_content">
                        <span class="labelStyle">距离底部:</span>
                        <input type="range" class="range_style" min="1" max="90" step="1" v-model="setFixBottom" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">边距:</span>
                        <input type="range" class="range_style" min="1" max="85" step="1" v-model="setFixLeft" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景透明度:</span>
                        <input type="range" class="range_style" min="0" max="1" step="0.01" v-model="setFixOpacity" />
                    </div>
                    <div class="common_content">
                        <span class="labelStyle">背景颜色:</span>
                        <input type="color" class="input_Color" v-model="setFixBgColor" />
                    </div>
                    <div class="banner_main">
                        <div class="banner_main_wrapper clear">
                            <div class="banner_img_wrapper" @click="setFixBgImg">
                                <img :src="getFixBgImg" class="navImg" />
                            </div>
                            <div class="banner_link_wrapper">
                                <span>链接至:</span>
                                <input disabled type="text" placeholder="点击选择链接" @input="addLink(index)" />
                            </div>
                        </div>
                    </div>
                </div>
                <!-- 视频设置 -->
                <div v-if="currentType === 'video'" class="banner_container">
                    <div class="common_title">视频设置</div>
                    <div class="common_content">
                        <span class="labelStyle">视频链接:</span>
                        <textarea v-model="setVideoLink" class="textAreaLink" rows="4" cols="40" placeholder="请填写视频原地址！以http:// 或 https://开头"></textarea>
                    </div>
                    <div class="common_content clear">
                        <span class="labelStyle fl">封面图片:</span>
                        <div class="poster_wrapper" @click="setVideoPoster">
                            <img :src="getVideoPoster" @click="setVideoPoster" />
                        </div>
                    </div>
                </div>
                <!-- 音频设置 -->
                <div v-if="currentType === 'audio'" class="banner_container">
                    <div class="common_title">音频设置(需要小程序V1.6.0版本以上)</div>
                    <div class="common_content">
                        <span class="labelStyle">音频链接:</span>
                        <textarea v-model="setAudioLink" class="textAreaLink" rows="4" cols="40" placeholder="请填写音频原地址！以http:// 或 https://开头"></textarea>
                    </div>
                    <div class="banner_main mt10 pad10 clear">
                        <div class="audio_wrapper">
                            <img :src="getAudioPoster" @click="setAudioPoster" />
                        </div>
                        <div class="audio_info_wrapper">
                            <div class="mt10">
                                <span>标题</span>
                                <input type="text" v-model="setAudioName" />
                            </div>
                            <div class="mt10">
                                <span>作者</span>
                                <input type="text" v-model="setAudioAuthor" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="block"></div>
        <div class="footer clear">
            <div class="btnWrapper">
                <a class="footer_btn" @click="AddDom('banner')">
                    <span class="iconfont">&#xe606;</span>
                    <span>轮播图</span>
                </a>
                <a class="footer_btn" @click="AddDom('advert')">
                    <span class="iconfont">&#xe606;</span>
                    <span>广告位</span>
                </a>
                <a class="footer_btn" @click="AddDom('navigation')">
                    <span class="iconfont">&#xe606;</span>
                    <span>宮格导航</span>
                </a>
                <a class="footer_btn" @click="AddDom('headline')">
                    <span class="iconfont">&#xe606;</span>
                    <span>标题</span>
                </a>
                <a class="footer_btn" @click="AddDom('blank')">
                    <span class="iconfont">&#xe606;</span>
                    <span>辅助空白</span>
                </a>
                <a class="footer_btn" @click="AddDom('search')">
                    <span class="iconfont">&#xe606;</span>
                    <span>搜索框</span>
                </a>
                <a class="footer_btn" @click="AddDom('line')">
                    <span class="iconfont">&#xe606;</span>
                    <span>分割线</span>
                </a>
                <a class="footer_btn" @click="AddDom('glossary')">
                    <span class="iconfont">&#xe606;</span>
                    <span>图文集</span>
                </a>
                <a class="footer_btn" @click="AddDom('button')">
                    <span class="iconfont">&#xe606;</span>
                    <span>按钮</span>
                </a>
                <a class="footer_btn" @click="AddDom('pictureList')">
                    <span class="iconfont">&#xe606;</span>
                    <span>图片列表</span>
                </a>
                <a class="footer_btn" @click="AddDom('fixed')">
                    <span class="iconfont">&#xe606;</span>
                    <span>悬浮图标</span>
                </a>
                <a class="footer_btn" @click="AddDom('video')">
                    <span class="iconfont">&#xe606;</span>
                    <span>视频</span>
                </a>
                <a class="footer_btn" @click="AddDom('audio')">
                    <span class="iconfont">&#xe606;</span>
                    <span>音频</span>
                </a>
            </div>
            <div class="center">
                <button class="save" @click="save">保存</button>
                <button class="save" @click="saveToMyTemplate">添加到我的模板</button>
            </div>
        </div>
    </div>
    <!--<script src="../addons/kundian_farm/resource/home/js/vue-components.js"></script>-->
    <script src="{$_W['siteroot']}/addons/kundian_farm/resource/home/js/vue-components.js"></script>
</body>

</html>


